<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>CSS-font-style </title>
</head>

<body>
<b style="color:red">指定字体系列-font-family</b>
<p style="font-family: georgia">This is a georgia Font</p>
<p style="font-family: 微软雅黑">这是微软雅黑字体</p>
<p style="font-family: georgia,'New York',serif">more font 以,分割,当指定字体名称中有空格的时候以'字符名称,并且一般在末尾加上通用字体'
</p>

<hr>
<br>
<b style="color:gray;">字体斜体风格-font-style</b><br>
<i style="font-style: normal;">this is &lt;i&gt; element<i style="font-style: inherit;">,inherit parent Elememt style</i></i>
<p style="font-style: italic;text-transform: capitalize;">This is a italic font</p>
<p style="font-style: oblique;background-color: rgba(255,25,28,0.5)">这是一个倾斜的字体格式</p>

<hr>
<br>
<b style="color: blue;">字体变形小型大写字母-font-variant </b><br>
<span style="text-transform： uppercase;background-color: rgba(255,25,28,0.5)">This is a Text-transform Uppercase </span> <b style="color: red">VS</b> <span style="font-variant: small-caps;background-color: gray;"> This is a font-variant small-caps</span>

<hr>
<br>
<b style="color: aqua;">字体加粗-font-weight  </b>
<p style="font-weight: lighter;">this is a lighter value,更细</p>
<span style="font-weight: 400;"> this is normal=400 value,普通Generic</span><br>
<p style="font-weight: bold;">this is a blod value,粗</p>
<p style="font-weight: bolder;">this is a bloder value,更粗</p>
<p style="font-weight: 900;">this is a 900,更粗</p>
<hr>
<br>

<b style="color: fuchsia">字体大小-font-size</b><br>
<span style="font-size: xx-small;"> This is a xx-small!!</span> --
<span style="font-size: medium;">this is a medium!!!</span>--
<span style="font-size: xx-large;">this is a xx-large</span>

<p style="font-size: large;">this is large vaule---<span style="font-size: smaller;">this is smaller</span></p>
<p style="font-size: x-small">this is x-small <span style="font-size: larger;">this is a larger</span></p>

<p style="font-size: 2em;">this is lenght 2em</p>
<p style="font-size: 100%;">This is 100% font-size</p>

<hr>
<br>
<b style="color: white;font-weight; bold;background-color: #778899;">font 声明全部属性</b>
<p style="font: italic small-caps bold medium/1em times,monospace">This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph.</p>
<p style="font: italic bold xx-large/20px courier,serif;">This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph.</p>
<q style="font: oblique lighter medium 'New York',serif;">这是是个段引用q标签</q>

<br>
<p>This is a normal paragraph</p>
<p style="font: caption">This is a paragraph with a "caption" font</p>
</body>
<html>
